<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta content="yes" name="apple-mobile-web-app-capable" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style" />
		<meta content="telephone=no" name="format-detection" />
		<meta content="email=no" name="format-detection" />
		<title>工单视图</title>
				<link rel="stylesheet" href="../../css/hui.css" />

		<link rel="stylesheet" href="../../css/s_plus.css" />
		<link rel="stylesheet" href="../../css/base.css" />
		<link rel="stylesheet" href="../../css/layout.css" />
		<link rel="stylesheet" href="../../css/choice.css" />
		<script type="text/javascript" src="../../libs/vue.js"></script>
		<script type="text/javascript" src="../../js/jquery.1.9.1.min.js"></script>
		<script type="text/javascript" src="../../js/app/url.js"></script>
		<script type="text/javascript" src="../../libs/hui.js"></script>
		<script type="text/javascript" src="../../js/s_plus.js"></script>
		<script type="text/javascript" src="../../js/md5.js"></script>
		<script type="text/javascript" src="../../js/app/api.js"></script>
		<script type="text/javascript" src="../../js/control/mescroll/mescroll.min.js"></script>
		<link rel="stylesheet" href="../../js/control/mescroll/mescroll.min.css" />
		<script type="text/javascript" src="../../js/control/select/iosSelect.js"></script>
		<link rel="stylesheet" href="../../js/control/select/iosSelect.css" />
<style>
	
	 .mescroll {
 	position: fixed;
 	top: 100px;
 	bottom: 0;
 	height: auto;
 }
</style>
	</head>

	<body>

		<div id="wrapper">

			<header class="f_l maxbox subhead">
				<a class="back" @click="back"><i class="iconfont">&#xe605;</i></a>
				<h1>工单视图</h1>

			</header>

		

			<section class="f_l maxbox edit_list">
				<ul>
					<li>
						<b>状态</b>
						<p>

							<select @change="check" v-model="workState">
								

								<option value="10">新建</option>
								<option value="20">待指派</option>
								<option value="30">待接收</option>
								<option value="40">待处理</option>
								<option value="50">进一步处理</option>
								<option value="60">已完成</option>
								<option value="90">已取消</option>
							</select>
						</p>
					</li>

					<!--<li>
						<b>时间</b>
						<p>
							<input id="xcTime" class="edit_txt" readonly="readonly" v-model="time" name="" type="text" placeholder="请选择时间">
						</p>
					</li>-->

				</ul>
			</section>

			<div id="myscroll" class="mescroll">
   <section class="f_l maxbox work_list">
        <dl v-for="item in lists">
          <a @click="detail(item.ID)">
            <dt>
              <i class="iconfont bg_red">&#xe60f;</i>
              <b v-text="item.ALARM_TITLE"></b>
            </dt>
            <dd class="txt_list">
              <p><em>告警类别：</em>{{showType(item.ALARM_TYPE)}}</p>
              <p><em>设备编号：</em>{{item.ZD_ID}}</p>
              <p><em>内容：</em>{{cut(item.ALARM_CONTENT)}}</p>
            </dd>
            <div class="sig bg_red">{{showStatus(item.WORK_STATE)}}</div>
          </a>
        </dl>
	</section>
			
				<div id="no_data"></div>

			</div>
		</div>
		<script>
			var sp = new Vue({
				el: "#wrapper",
				data: {
					workState: "20",
					time: "",
					startTime: "",
					endTime: "",
					lists: []

				},
				methods: {
					cut:function(param){
						if(param!=null&&param.length>22){
							param = param.substr(0,22);
							param+="...";
							console.log("string-----"+param);
							return param;
						}
						return param;
					},
					back: function() {
						hui.back();
					},
					check: function() {
						var page = {
							num: 1,
							size: 10,
							time: null
						};
						refreshData(page);
					},
				
				
					detail:function(pid){
							console.log(pid);
							localStorage.setItem("workid",pid);
							localStorage.setItem("type","view");

							hui.open("work_show.html?time="+apiManage.getNow(), {}, true, {});	

							
						},

					geshi: function(param) {
						return formatTime(param);
					},

					showType:function(param){
							if(param=='1'){
								return "一般告警";
							}
							else{
								return "严重告警";

							}
						},
							showStatus:function(param){
							var text= "";
//10	新建	work_state	
//20	待指派	work_state	
//30	待接收	work_state	
//40	待处理	work_state	
//50	进一步处理	work_state	
//60	已完成	work_state	
//90	已取消
							if(param =='10'){
								text='新建';
							}
							else if(param =='20'){
								text='待指派';
							}
							else if(param =='30'){
								text='待接收';
							}
							else if(param =='40'){
								text='待处理';
							}
							else if(param =='50'){
								text='进一步处理';
							}
							else if(param =='60'){
								text='已完成';
							}
							else{
								text='已取消';
							}
							
							return text;

						},
					showState: function(param) {
						//								0下发 1接收 2处理
						if(param == '0') {
							return "下发";
						} else if(param == '1') {
							return "接收";
						} else {
							return "处理";

						}
					},
					gisMap: function() {
						hui.open("risk_map.html", {}, true, {});
					}

				},
				mounted: function() {
					var nowdate = new Date();
					var y = nowdate.getFullYear();
					var m = nowdate.getMonth() + 1;
					var d = nowdate.getDate();
					var formatnowdate1 = y + '-' + m + '-' + d;
					this.endTime = formatnowdate1;
					console.log(formatnowdate1);

					//获取系统前一个月的时间
					nowdate.setMonth(nowdate.getMonth() - 1);
					var y = nowdate.getFullYear();
					var m = nowdate.getMonth() + 1;
					var d = nowdate.getDate();
					var formatwdate2 = y + '-' + m + '-' + d;
					this.startTime = formatwdate2;
					console.log(formatwdate2);

					//创建MeScroll对象,down可以不用配置,因为内部已默认开启下拉刷新,重置列表数据为第一页
					//解析: 下拉回调默认调用mescroll.resetUpScroll(); 而resetUpScroll会将page.num=1,再执行up.callback,从而实现刷新列表数据为第一页;
					var self = this;
					self.mescroll = new MeScroll("myscroll", { //请至少在vue的mounted生命周期初始化mescroll,以确保您配置的id能够被找到
						up: {
							auto: true,
							callback: refreshData,
							isBounce: false,
							empty: {
								warpId: "no_data",
								tip: "-------暂无数据-------"
							},
						}
					});

				}

			});

			function refreshData(page) {

				console.log("page params-----" + JSON.stringify(page));

				var path = urlManager.getWorkView();
				var username = localStorage.getItem("username");
				var sec = localStorage.getItem("sec_pwd");
				var time = apiManage.getNow();
				var key = "loginName=" + username + "&passWord=" + sec + "&time=" + time;
				var paramKey = hex_md5(key);
				var jsonParam = JSON.stringify({
					loginName: username,
					time: time,
					key: paramKey
				});
				console.log(jsonParam);
				//					/phoneWork/workview?workState=60&updateDateStart=2018-10-25&updateDateEnd=2018-10-26
				var params = {
					workState: sp.workState,
					updateDateStart: sp.startTime,
					updateDateEnd: sp.endTime,
					pageNo: page.num,
					pageSize: 10
				};

				console.log("params-----" + JSON.stringify(params));
				console.log("path-----" + path);
                hui.loading("");
				$.ajax({
					type: "GET",
					url: path,
					data: params,
					beforeSend: function(request) {
						request.setRequestHeader("loginName", username);
						request.setRequestHeader("time", time);
						request.setRequestHeader("sign", paramKey);
						request.setRequestHeader("Content-Type", "application/text");

					},
					success: function(result) {
						hui.closeLoading();
						console.log("工单视图列表2:" + JSON.stringify(result));
						var datas = result.list;
						if(datas != null) {
							//如果是第一页需手动制空列表 (代替clearId和clearEmptyId的配置)
							if(page.num == 1) {
								sp.lists = []
							};

							//更新列表数据
							sp.lists = sp.lists.concat(datas);

							if(sp.lists.length < 10) {
								sp.mescroll.endSuccess(sp.lists.length, false);
							} else {
								sp.mescroll.endSuccess(sp.lists.length, true);

							}

							//sp.mescroll.endBySize(sp.lists.length,dataJson.bodyData.totalItems); //必传参数(当前页的数据个数, 总数据量)
						} else {
							sp.lists = null;
							sp.mescroll.endErr();
						}

					}
				});

			}

			Date.prototype.format = function(format) //author: meizz
			{
				var o = {
					"M+": this.getMonth() + 1, //month
					"d+": this.getDate(), //day
					"h+": this.getHours(), //hour
					"m+": this.getMinutes(), //minute
					"s+": this.getSeconds(), //second
					"q+": Math.floor((this.getMonth() + 3) / 3), //quarter
					"S": this.getMilliseconds() //millisecond
				}
				if(/(y+)/.test(format)) format = format.replace(RegExp.$1,
					(this.getFullYear() + "").substr(4 - RegExp.$1.length));
				for(var k in o)
					if(new RegExp("(" + k + ")").test(format))
						format = format.replace(RegExp.$1,
							RegExp.$1.length == 1 ? o[k] :
							("00" + o[k]).substr(("" + o[k]).length));
				return format;
			}

			function formatTime(val) {
				if(val == null || val == '') {
					return "";
				}
				var re = /-?\d+/;
				var m = re.exec(val);
				//	         m = m.replace(/\-/g, "/");
				var d = new Date(parseInt(m[0]));

				return d.format("yyyy-MM-dd hh:mm:ss");
			}
		</script>

	</body>

</html>